<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>报表表格</title>
    <script src="${base}/forScreen/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="${base}/scripts/highcharts/highcharts.js" type="text/javascript"></script>
    <script>
        $(function () {

            // Radialize the colors
            Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function(color) {
                return {
                    radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
                    stops: [
                        [0, color],
                        [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
                    ]
                };
            });

            // Build the chart
            $('#container').highcharts({
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: new Date().getFullYear() +'-'+(new Date().getMonth()+1)+'-'+new Date().getDate() + '经营收入饼状图'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            formatter: function() {
                                return '<b>'+ this.point.name +'</b>: ￥'+ this.point.y;
                            }
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: '经营收入',
                    data: [
                        <#if result.get('rows')??>
                            <#list result.get("rows") as rows>
                                ['${rows.get("GS")!}',${rows.get("XSE")!}]<#if rows_has_next>,</#if>
                            </#list>
                        </#if>
                    ]
                }]
            });
            $('#container1').highcharts({
                chart: {
                    type: 'column'
                },
                title: {
                    text: new Date().getFullYear() +'-'+(new Date().getMonth()+1)+'-'+new Date().getDate() + '销售利润柱状图'
                },
                xAxis: {
                    categories: [
                    <#if result.get('rows')??>
                        <#list result.get("rows") as rows>
                            '${rows.get("GS")!}'<#if rows_has_next>,</#if>
                        </#list>
                    </#if>
                    ]
                },
                yAxis: {
                    title: {
                        text: '销售利润(万元)'
                    }
                },
                credits: {
                    enabled: false
                },
                series: [{
                    name: '销售利润',
                    data: [
                    <#if result.get('rows')??>
                        <#list result.get("rows") as rows>
                        ${rows.get("XSLR")/10000!}<#if rows_has_next>,</#if>
                        </#list>
                    </#if>
                    ]
                }]
            });
        });
    </script>

</head>

<body>
<div id="container" style="display:inline-block;width:50%;float:left;"></div>
<div id="container1" style="display:inline-block;width:50%;float:left;"></div>
</body>

</html>
